<template>
  <div class="app-container">
    <form-filter @on-filter="submitFilterForm"/>
    <el-table border :data="tableData.list" v-loading="loading" element-loading-text="加载中..." class="mgtop">
      <el-table-column label="操作时间"  prop="modifyTime" align="center" width="260">
        <template slot-scope="{row}">
           {{row.modifyTime | toTime('YYYY-MM-DD HH:mm:ss')}}
        </template>
      </el-table-column>
      <el-table-column label="账号名" prop="username" align="center" ></el-table-column>
      <el-table-column label="当前VIP等级" prop="vipLevelAfter" align="center" >
         <template slot-scope="{row}">
           {{row.vipLevelAfter | VIPlevel}}
        </template>
      </el-table-column>
      <el-table-column label="锁定状态" prop="lockStatus" align="center" >
         <template slot-scope="{row}">
           {{row.lockStatus==0?'已解锁':'已锁定'}}
        </template>
      </el-table-column>
      <el-table-column label="操作人" prop="modifyOperator" align="center"></el-table-column>
    </el-table>


    <div class="pagination-container">
      <el-pagination background @size-change="gridSizeChange" @current-change="gridCurrentChange"
                     :current-page="filters.page" :page-sizes="gridPageSize" :page-size="filters.size"
                     :layout="gridLayout" :total="Number(tableData.total)">
      </el-pagination>
    </div>

  </div>
</template>


<script>
import { vipLuckRecord } from '@/services/api/member';
import FormFilter from './formFilter.vue';

import { grid } from '@/build';
import vipManage from '@/const/vipManage';

export default {
  name: 'reportLog',
  components: { FormFilter },
  mixins: [grid],
  props: ['value'],
  data() {
    return {
      tableData: {},
      filters: {
        page: 1,
        size: 20,
        username: '',
        lockStatus: undefined,
        modifyTimeStart: moment().format('YYYY-MM-DD 00:00:00'),
        modifyTimeEnd: moment().format('YYYY-MM-DD 23:59:59'),
      },
      filterDateType: false,
    };
  },
  filters: {
    VIPlevel(value) {
      return _.find(vipManage.VIP_LEVEL, { value }).title;
    },
  },
  methods: {
    submitFilterForm(formInline) {
      const { Time } = formInline;
      if (!_.isUndefined(Time) && _.isArray(Time)) {
        [this.filters.modifyTimeStart, this.filters.modifyTimeEnd] = Time;
      } else {
        this.filters.modifyTimeStart = undefined;
        this.filters.modifyTimeEnd = undefined;
      }
      this.filters = { ...this.filters, ...formInline };
      this.doGet({ action: 'getGrid' });
    },
  },
  mounted() {
    this.bindGet(vipLuckRecord, 'tableData', {
      action: 'getGrid',
      sendingData: 'filters',
    });
    this.getAll();
  },
};
</script>

<style scoped>
.mgtop{margin-top:30px}
</style>
